<template>
  <div>
    <div class="divBar" />
    <h5 class="titleInfo" />

    <el-form ref="form2" class="form" :model="form2" disabled label-width="150px">
      <el-row>
        <el-form-item label="门店头像" prop="shop_logo">
          <newUpload ref="uploadImg6" :fileNum="1" :file-list="fileList6" :size-number="0.08" />
          <!-- <p class="msgText">* 文件格式JPG、JPEG、PNG文件大小80K以内，建议尺寸80PX*80PX</p> -->
        </el-form-item>

        <el-form-item label="门店环境" prop="image_ids">
          <newUpload ref="uploadImg7" :fileNum="12" :file-list="fileList7" :size-number="2" />
        </el-form-item>

        <!-- <el-form-item label="作品集" prop="works_ids">
                    <newUpload
                        ref="uploadImg8"
                        :fileNum="20"
                        :file-list="fileList8"
                        :size-number="2"
                    />
        </el-form-item>-->
        <!-- <el-form-item label="商家视频" prop="description2">
                <newUpload
                  ref="uploadImg"
                  :fileNum="fileNum3"
                  :fileList="fileList8"
                />
                <p class='msgText'>视频主图为展示的第一个视频，添加视频，最多可添加10个</p>
        </el-form-item>-->
      </el-row>
      <!-- <el-form-item>
            <el-button style="margin:30px 0" type="primary" @click="submitShop('form2')">保存</el-button>
      </el-form-item>-->
    </el-form>
  </div>
</template>

<script>
import newUpload from "@/components/imgUpload/shopImgUp";
import { picData } from "@/api/shopMange";

export default {
  components: { newUpload },

  data() {
    var shopLogo = (rule, value, callback) => {
      if (!this.form2.shop_logo) {
        callback(new Error("请上传门店头像"));
      } else {
        callback();
      }
    };
    var imageIds = (rule, value, callback) => {
      if (!this.form2.image_ids) {
        callback(new Error("请上传门店环境"));
      } else {
        callback();
      }
    };
    return {
      fileList6: [],
      fileList7: [],
      // fileList8: [],
      form2: {},
      rules2: {
        shop_logo: [{ required: true, validator: shopLogo }],
        image_ids: [{ required: true, validator: imageIds }],
      },
    };
  },
  created() {
    this.getPic();
  },
  methods: {
    //获取门店环境   图片回显
    getPic() {
      let id = Number(this.$route.query.id);
      picData({ shop_id: id }).then((res) => {
        // console.log(res)
        const ImgUrl = "http://mmkappnew.oss-cn-beijing.aliyuncs.com/";
        if (res.data.code == 200 && res.data.data.shop_logo) {
          let life_shop_work = res.data.data.life_shop_work.map((item) => {
            return { url: ImgUrl + item };
          });
          let life_shop_images = res.data.data.life_shop_images.map((item) => {
            return { url: ImgUrl + item };
          });

          this.fileList6 = [{ url: ImgUrl + res.data.data.shop_logo }];
          this.fileList7 = life_shop_images;
          // this.fileList8 = life_shop_work;
          this.$refs.uploadImg6.getLength(this.fileList6);
          this.$refs.uploadImg7.getLength(this.fileList7);
          // this.$refs.uploadImg8.getLength(this.fileList8);
        }
      });
    },
  },
};
</script>